<template>
	<view class="container">
		<!-- 顶部工具栏 -->
		<view class="top-container">
			<view class="top-wrapper">
				<view class="user-info">
					<view @click="help" class="user-head">
						<image :src='avatar' mode="widthFix"></image>
					</view>
					<view class="user-name">
						<text>{{realname}}</text>
					</view>
				</view>


			</view>
			<view class="user-menu">
				<view @click="open2">
					<image src="../../static/index/phone.png"></image>

					电话
				</view>
				<!-- <view>
					<button open-type="contact" size="default" hover-class="none" plain="true" type="default">
						<image src="../../static/index/consult.png"></image>
					</button>
					咨询
				</view> -->
				<view @click="open3">
					<image src="../../static/index/message.png"></image>
					微信
				</view>
				<uni-popup id="wechat" ref="popup3">

					<view id="guwen-code">
						<image :src="this.wxQrcode" mode=""></image>
					</view>
					<view id="guwen-info">
						<text>{{realname}}</text><text>{{phone}}</text>
					</view>
					<view id="loupan-info">
						<text>楼盘项目:</text><text>{{departName}}</text>
					</view>


				</uni-popup>
				<view @click="open6">
					<image src="../../static/index/share.png"></image>
					分享
				</view>
				<uni-popup class="share1" ref="popup6">
					<text>请点击右上角分享给朋友</text>
					<image id="arrow1" src="../../static/index/arrow9.png" mode=""></image>

				</uni-popup>


			</view>
		</view>
		<!-- 文章主体部分 -->
		<view class="main-body">
			<!-- 标题 -->
			<view class="top-title">
				<text>{{title}}</text>
			</view>
			<!-- 关注公众号 -->
			<view class="wx-gzh">
				<view class="gzh-img">
					<image :src="logoUrl"></image>
				</view>
				<view class="gzh-info">
					<view><text>{{departName}}</text></view>
					<view><text></text></view>
				</view>
				<view class="gzh-focus">
					<view @click="open5" class="focus-btn">
						<text>关注</text>
					</view>
					<uni-popup id="wechat1" ref="popup5">
						<image :src="this.wxServiceQrcode" mode=""></image>
					</uni-popup>
				</view>
			</view>

			<!-- 内容图片 -->
			<!-- <view class="content-image">
				<image src="" mode="widthFix"></image>
			</view> -->
			<!-- 内容段落 -->
			<view class="content-text">
				<rich-text :nodes="content">

				</rich-text>

			</view>
			<view class="user-operation">
				<view>
					<image src="../../static/index/read.png"></image>
					{{readNum}}阅读
				</view>
				<view >
					<image src="../../static/index/share2.png" mode=""></image>
					{{shareNum}}分享
				</view>
				<view @click="isLike1" v-if="isFabulous=='0'">
					<image @click="getFabulous" src="../../static/index/collect1.png"></image>{{fabulousNum}}喜欢
				</view>
				<view @click="isLike2" v-if="isFabulous=='1'">
					<image src="../../static/index/collect.png" mode=""></image>
					{{fabulousNum}}喜欢
				</view>
			</view>
			<view class="space">

			</view>
		</view>
		<!-- 底部菜单 -->
		<view class="tabbar">
			<view @click="open1">
				<image src="../../static/index/phone1.png"></image>
				<text>留电</text>
			</view>
			<uni-popup id="pop-h5" ref="popup1" type="dialog">
				<uni-popup-dialog id="input-h5" mode="input" title="留电获取专属服务" message="成功消息" :duration="2000"
					:before-close="true" @close="close1" @confirm="confirm1"></uni-popup-dialog>
			</uni-popup>

			<view @click="open2">
				<image src="../../static/index/phone2.png"></image>
				<text>致电</text>
			</view>
			<uni-popup id="pop-h5" ref="popup2" type="dialog">
				<uni-popup-dialog id="input-h5" mode="base" title="致电" :content="this.phone" message="成功消息"
					:duration="2000" :before-close="true" @close="close2" @confirm="confirm2"></uni-popup-dialog>
			</uni-popup>

			<view @click="gomap">
				<image src="../../static/index/direct.png"></image>
				<text>导航</text>
			</view>
			<!-- <view @click="goContact">

				<image src="../../static/index/consult1.png"></image>

				<text>咨询</text>
			</view> -->
		</view>
		<!-- 右侧悬浮按钮 -->
		<!-- <view @click="open4" class="right-nav">
			<image src="../../static/index/fangYuan2.png" mode=""></image>
		</view>
		<uni-popup id="miniprogram" ref="popup4">
			<image src="../../static/index/test.jpg" mode=""></image>
		</uni-popup> -->

		<!-- <view class="intro">本项目已包含uni ui组件，无需import和注册，可直接使用。在代码区键入字母u，即可通过代码助手列出所有可用组件。光标置于组件名称处按F1，即可查看组件文档。</view>
		<text class="intro">详见：</text> -->
		<!-- <uni-link :href="href" :text="href"></uni-link> -->
	</view>
</template>
<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

<script>
	var that;
	var jweixin = require('jweixin-module');


	export default {
		data() {
			return {
				fileUrl: '',
				// domainUrl: 'http://weixiaokong.91xiaokong.com/jeecg-boot/',
				// domainUrl: 'http://chewei.mynatapp.cc/jeecg-boot/',
				title: "",
				content: '',
				realname: '',
				departName: '',
				logoUrl: '',
				avatar: '',
				phone: '',
				timestamp: '',
				fabulousNum: '',
				zhiyeId: '',
				orgCode: '',
				customPhone: '',
				nickname: '',
				noticeId: '',
				phone: '',
				openid: '',
				wxQrcode: '',
				wxServiceQrcode: '',
				likeNum: 0,
				readNum: 0,
				shareNum: 0,
				isFabulous: '',
				nonceStr: '',
				signature: '',
				timestamp: '',
				shareUrl: '',
				sharePicUrl: ''
			}
		},


		onLoad: function(option) {

			that = this;
			that.noticeId = option.noticeId;
			that.openid = option.openid;

			that.nickname = decodeURIComponent(option.nickname);
			that.phone = option.phone;
			var haveopenid = uni.getStorageSync('openid');
			var havenickname = uni.getStorageSync('nickname');
			// var havenoticeId = uni.getStorageSync('noticeId');
			// cosole.log("缓存openind: " + openid)
			if (haveopenid) {

				that.openid = haveopenid;
				that.nickname = havenickname;
				// that.noticeId = havenoticeId;
			} else {
				uni.setStorageSync(
					'openid',
					that.openid,
				);
				uni.setStorageSync(
					'nickname',
					that.nickname
				);
				// uni.setStorageSync(
				// 	'noticeId',
				// 	that.noticeId
				// );
				// that.getUserInfo();
			}
			// uni.setStorageSync('openid',that.openid);
			// uni.setStorageSync("userName",this.nickname);
			// uni.setStorageSync("noticeIds",this.noticeId);

			that.getInfo();
			// this.getAccess();

			// this.getDetail();


		},



		methods: {
			// 跳转到求救
			help(){
				uni.navigateTo({
					url:"../help/help"
				})
			},
			// 获取签名
			getAccess() {
				// alert(location.href.split('#')[0]);

				var jiekouUrl = window.location.href;

				uni.request({
					// url:'http://chewei.mynatapp.cc/jeecg-boot/wx/user/getWXToken',					
					url: that.domainUrl + 'wx/user/getWXToken',
					data: {
						// shareUrl: 'http://chewei.mynatapp.cc/#/?noticeId=1406788377667973121&phone=18203895809'
						// 	shareUrl: 'http://article.weixiaokong.com/#/?openid=ogiDYs7VebisnjEjBfpOFkSPI8_c&nickname=Slyer&noticeId=1406788377667973121&phone=18203895809'
						// },
						shareUrl: jiekouUrl,
					},
					success(res) {
						that.nonceStr = res.data.nonceStr;
						that.signature = res.data.signature;
						that.timestamp = res.data.timestamp;
						that.shareUrl = res.data.url;

						jweixin.config({
							debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
							appId: 'wx778f313eff0f980b', // 必填，公众号的唯一标识
							timestamp: that.timestamp, // 必填，生成签名的时间戳
							nonceStr: that.nonceStr, // 必填，生成签名的随机串
							signature: that.signature, // 必填，签名
							jsApiList: ['updateAppMessageShareData',
								'updateTimelineShareData',
								'onMenuShareAppMessage',
								'onMenuShareTimeline'
							] // 必填，需要使用的JS接口列表
						});
						jweixin.ready(function() {
							that.fileUrl = "https://shengrun.91xiaokong.com/chewei/" + that.sharePicUrl;
							var shareData = {
								title: '河南精准软件', // 分享标题
								desc: '河南精准软件', // 分享描述
								link: jiekouUrl, // 分享链接 
								imgUrl: that.fileUrl,
								// 'https://shengrun.91xiaokong.com/chewei/files/20210628/static.jisutui_1624862899900.jisutui.jpg',
								// imgUrl: "https://shengrun.91xiaokong.com/chewei/" + that
								// .sharePicUrl, // 分享图标
								type: '', // 分享类型,music、video或link，不填默认为link
								dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
								success: function() {
									// alert("分享微信好友成功！");
									that.getShare();
								},
								cancel: function() {
									// alert('分享微信好友失败');
								}
							};

							jweixin.updateAppMessageShareData(shareData);
							jweixin.updateTimelineShareData(shareData);


						});




					}
				})



				// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。

				// uni.request({
				// 	url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wx778f313eff0f980b&secret=910415b15c96d7268cc1ee899f5fc8cd',
				// 	success(res) {
				// 	}
				// })
				// window.location.href = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wx778f313eff0f980b&secret=910415b15c96d7268cc1ee899f5fc8cd',

			},
			// 详情接口
			getDetail() {
				if ((location.href).indexOf('&nickname=') == -1) {

				} else {
					let curUrl1 = (location.href).split('&nickname=');
					let curUrl2 = curUrl1[1].split('&noticeId=');
					that.nickname = curUrl2[0];

				}
				// console.log(that.nickname);
				// http://article.weixiaokong.com/#/?openid=ogiDYs7VebisnjEjBfpOFkSPI8_c&nickname=Slyer%3F&noticeId=1406788377667973121&phone=18203895809
				// const haveopenid = uni.getStorageSync('openid');
				// const havenickname = uni.getStorageSync('nickname');
				// const havenoticeId = uni.getStorageSync('noticeId');
				// console.log(that.zhiyeId);
				uni.request({
					// url: 'http://weixiaokong.91xiaokong.com/jeecg-boot/manager/notice/dcNotice/h5/query/detail/' +that.noticeId + "/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname + "/",
					url: that.domainUrl + 'manager/notice/dcNotice/h5/query/detail/' + that.noticeId + "/" + that
						.zhiyeId + "/" + that.phone + "/" + that.nickname + "/" + that.openid + "/",
					// dataType:JSON,
					// url: 'https://chewei.mynatapp.cc/jeecg-boot/manager/notice/dcNotice/h5/query/detail/' + that
					// 	.noticeId + "/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname + "/" + that.openid + '/',
					success(res) {

						that.content = res.data.result.content;
						that.title = res.data.result.title;
						uni.setNavigationBarTitle({
							title: res.data.result.title
						});
						that.orgCode = res.data.result.orgCode;
						that.readNum = res.data.result.readNum;
						that.shareNum = res.data.result.shareNum;
						that.fabulousNum = res.data.result.fabulousNum;
						that.isFabulous = res.data.result.isFabulous;
						that.sharePicUrl = res.data.result.sharePicUrl;
						that.getAccess();



					},
					fail(err) {

					}
				});

			},
			// 顾问信息接口
			getInfo() {
				// console.log('123')
				uni.request({
					// url: 'http://weixiaokong.91xiaokong.com/jeecg-boot/manager/sys/zhiYeUser/queryByPhone/',
					url: that.domainUrl + 'manager/sys/zhiYeUser/queryByPhone/',
					// url: 'https://chewei.mynatapp.cc/jeecg-boot/manager/sys/zhiYeUser/queryByPhone/',
					data: {
						phone: that.phone
					},
					success(res) {
						// console.log(res);
						// that.wxServiceQrcode = res.data.result.wxServiceQrcode
						that.avatar = res.data.result.avatar,
							that.departName = res.data.result.departName,
							that.logoUrl = "https://shengrun.91xiaokong.com/chewei/" + res.data.result.logoUrl,
							that.avatar = "https://shengrun.91xiaokong.com/chewei/" + res.data.result.avatar,
							that.realname = res.data.result.realname,
							that.timestamp = res.data.timestamp,
							that.zhiyeId = res.data.result.zhiyeId,
							that.wxQrcode = "https://shengrun.91xiaokong.com/chewei/" + res.data.result.wxQrcode,
							that.wxServiceQrcode = "https://shengrun.91xiaokong.com/chewei/" + res.data.result
							.wxServiceQrcode,
							that.getDetail();





					}

				})

			},
			// 分享接口
			getShare() {
				uni.request({
					// url: 'http://weixiaokong.91xiaokong.com/jeecg-boot/manager/notice/dcNotice/h5/share/or/fabulous/' +that.noticeId + "/" + "share/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname +"/",
					url: that.domainUrl + 'manager/notice/dcNotice/h5/share/or/fabulous/' + that
						.noticeId + "/" + "share/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname + "/" +
						that.openid + '/',
					// url: 'https://chewei.mynatapp.cc/jeecg-boot/manager/notice/dcNotice/h5/share/or/fabulous/' +that.noticeId + "/" + "share/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname +"/" + that.openid + '/',

					success(res) {

					}
				})
			},
			// 点赞接口
			getFabulous() {

				uni.request({
					// url: 'http://weixiaokong.91xiaokong.com/jeecg-boot/manager/notice/dcNotice/h5/share/or/fabulous/' +that.noticeId + "/" + "fabulous/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname +"/",
					url: that.domainUrl + 'manager/notice/dcNotice/h5/share/or/fabulous/' + that
						.noticeId + "/" + "fabulous/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname +
						"/" + that.openid + '/',
					// url: 'https://chewei.mynatapp.cc/jeecg-boot/manager/notice/dcNotice/h5/share/or/fabulous/' +that.noticeId + "/" + "fabulous/" + that.zhiyeId + "/" + that.phone + "/" + that.nickname +"/"+ that.openid + '/',

					success(res) {

					}
				})
			},
			// 授权接口
			getUserInfo() {
				// console.log(param);
				// window.location.href = "http://weixiaokong.91xiaokong.com/jeecg-boot/wx/mp/wxLoginShare?noticeId=" + that.noticeId + '&phone=' + that.phone;
				// window.location.href = that.domainUrl + "wx/mp/wxLoginShare?noticeId=" + that.noticeId + '&phone=' + that
				// 	.phone;

				// window.location.href = "https://chewei.mynatapp.cc/jeecg-boot/wx/mp/wxLoginShare?noticeId=" + that.noticeId + '&phone=' + that.phone;

			},
			// 留电按钮
			open1() {
				this.$refs.popup1.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close1() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup1.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm1(value) {
				let that = this;
				this.customPhone = value;
				// console.log(that.zhiyeId);
				// console.log(that.nickname);
				// console.log(that.customPhone);
				// console.log(that.orgCode);
				uni.request({
					method: "post",
					// url: "http://weixiaokong.91xiaokong.com/jeecg-boot/customer/dcOrderUser/save?zhiyeId=" + that.zhiyeId + "&customerName=" + that.nickname + "&phone=" + that.phone + "&orgCode=" + that.orgCode,
					url: that.domainUrl + "customer/dcOrderUser/save?zhiyeId=" + that.zhiyeId +
						"&customerName=" + that.nickname + "&phone=" + that.phone + "&orgCode=" + that.orgCode,
					// url: "https://chewei.mynatapp.cc/jeecg-boot/customer/dcOrderUser/save?zhiyeId=" + that.zhiyeId + "&customerName=" + that.nickname + "&phone=" + that.phone + "&orgCode=" + that.orgCode,
					data: {
						zhiyeId: that.zhiyeId,
						customerName: that.nickname,
						phone: that.customPhone,
						orgCode: that.orgCode

					},
					success(res) {
						// console.log(res);
						uni.showToast({
							title: '留电成功'
						})
					},
					fail(err) {
						uni.showToast({
							title: "留电失败，请稍后重试"
						})
					}
				})

				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup1.close()
			},
			// 致电按钮
			open2() {
				this.$refs.popup2.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close2() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup2.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm2() {
				// 输入框的值
				// console.log();
				// 打电话
				uni.makePhoneCall({
					phoneNumber: this.phone
				})
				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup2.close()
			},
			// 上方菜单栏微信按钮
			open3() {
				this.$refs.popup3.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close3() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup3.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm3() {
				// 输入框的值
				// console.log();
				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup3.close()
			},
			// 右侧悬浮按钮
			open4() {
				this.$refs.popup4.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close4() {
				// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup4.close()
			},
			/**
			 * 点击确认按钮触发
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm4() {
				// 输入框的值
				// console.log();
				// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
				// ...
				this.$refs.popup4.close()
			},
			open5() {
				this.$refs.popup5.open()
			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close5() {
				// ...
				this.$refs.popup5.close()
			},
			/**
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm5() {
				// console.log();
				this.$refs.popup5.close()
			},
			open6() {
				this.$refs.popup6.open();

			},
			/**
			 * 点击取消按钮触发
			 * @param {Object} done
			 */
			close6() {
				// ...
				this.$refs.popup6.close()
			},
			/**
			 * @param {Object} done
			 * @param {Object} value
			 */
			confirm6() {
				// console.log();
				this.$refs.popup6.close()
			},

			gomap() {
				uni.navigateTo({
					url: "../gomap/gomap"
				})
			},
			goContact() {
				uni.navigateTo({
					url: "../contact/contact"
				})
			},
			// 点赞按钮
			isLike1() {
				// console.log(this);

				this.isFabulous = 1;
				this.fabulousNum += 1;
				uni.setStorageSync("isLike", true)


			},
			isLike2() {
				// console.log(this);

				this.isFabulous = 0;
				this.fabulousNum -= 1;
				uni.setStorageSync("isLike", false)


			}

		}
	}
</script>

<style scoped>
	.container {
		/* position: relative; */
		padding: 0px;
		font-size: 24rpx;
		/* overflow-y: scroll; */
	}

	/* 微信弹出框 */

	#wechat1 {
		width: 200rpx;
		height: 200rpx;
	}

	/* 职业顾问信息弹窗 */
	#guwen-info {
		font-size: 20rpx;
		padding-top: 20rpx;
		position: relative;
		top: -20rpx;
		left: -10rpx;
		width: 310rpx;
		height: 30rpx;
		padding-left: 10rpx;
		flex-direction: row;
		justify-content: flex-start;
		display: flex;
		background-color: #fff;
		border-top: #3F536E solid 1rpx;
	}

	#guwen-info text:nth-child(1) {
		margin-right: 10rpx;
	}

	#loupan-info {
		background-color: #fff;
		font-size: 20rpx;
		position: relative;
		top: -20rpx;
		left: -10rpx;
		padding-left: 10rpx;
		display: flex;
		justify-content: flex-start;
		width: 310rpx;
		flex-direction: row;
		height: 50rpx;
		border-radius: 0 0 20rpx 20rpx;
	}

	#guwen-code {
		left: 0rpx;
		top: 0rpx;
		position: absolute;
		width: 320rpx;
		height: 300rpx;
	}

	#guwen-code image {
		width: 320rpx;

		height: 300rpx;
		position: absolute;
		left: -10rpx;
		top: -320rpx;
		border-radius: 20rpx 20rpx 0 0;
	}

	#wechat1 image {
		width: 300rpx;
		height: 300rpx;
		/* border-radius: 50%; */
	}

	/* 分享按钮 */
	.share1 text {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 300rpx;
		height: 80rpx;
		border-radius: 20rpx;
		position: relative;
		top: -400rpx;
		left: 170rpx;
		background-color: #fff;
	}

	#arrow1 {
		width: 100rpx;
		height: 100rpx;
		transform: rotateX(180deg) rotateY('angle');
		position: absolute;
		left: 400rpx;
		top: -700rpx;

	}

	/* 右侧悬浮窗跳转 */
	#miniprogram {
		width: 200rpx;
		height: 200rpx;
	}

	#miniprogram image {
		width: 200rpx;
		height: 200rpx;

		position: absolute;
		left: 70rpx;
		top: 320rpx;
	}

	/* 弹出框 */
	#pop-h5 {
		position: absolute !important;
		left: 0;
		/* top: 500rpx; */
		width: 750rpx;
		height: 600rpx;
		/* background-color: #bfa; */
	}

	#input-h5 {
		position: relative;
		left: 0;
		/* top: 615rpx; */
		width: 750rpx;
		border-radius: unset;
		height: 400rpx;
		background-color: #fff;
	}

	/* 顶部用户菜单 */
	.top-container {
		position: relative;
		/* display: flex; */
		/* justify-content: center; */
		width: 750rpx;
		height: 540rpx;
		/* overflow: hidden; */
	}

	.top-wrapper {
		display: flex;
		flex-flow: column;
		justify-content: space-evenly;
		align-items: center;
		width: 750rpx;
		height: 441rpx;
		background: linear-gradient(50deg, #2257D0 0%, #05ACFF 99%);
	}

	.user-info {
		width: 750rpx;
		height: 122rpx;
		margin-top: 30rpx;
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.user-head {
		width: 114rpx;
		height: 114rpx;
		margin-left: 54rpx;
		background-color: #fff;
		overflow: hidden;
		/* background-image: url({{user-head}}); */
		/* border: 1rpx #fff solid; */
		border-radius: 50%;
	}

	.user-head image {
		width: 114rpx;
		height: 114rpx;
		/* border-radius: 50%; */

	}


	.user-name {
		margin-left: 30rpx;
		font-size: 34rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}

	.user-menu {
		position: relative;
		/* left: 30rpx; */
		top: -100rpx;
		margin: 0 auto;
		display: flex;
		/* margin-top: 63rpx; */
		justify-content: space-around;
		align-items: center;
		width: 690rpx;
		height: 199rpx;
		box-shadow: 0rpx 0rpx 24rpx 0rpx rgba(101, 176, 249, 0.41);
		border-radius: 20rpx;
		background-color: #fff;
	}

	/* .user-menu view {
		width: 50rpx;
		height: 100rpx;
		margin: 0;
		padding: 0;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	} */
.user-menu view {
		width: 8vw;
		height: 7vh;
		margin: 0;
		padding: 0;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	}

	.user-menu view button {
		margin: 0;
		padding: 0;
		width: 50rpx;
		height: 100rpx;
		/* background-color: #bfa; */
		border: none;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
	}

	.user-menu view image {
		width: 50rpx;
		height: 50rpx;
	}

	.user-menu view button image {
		width: 50rpx;
		height: 50rpx;
	}

	/* 主题文章部分 */
	.main-body {
		display: flex;
		width: 700rpx;
		/* height: 890rpx; */
		overflow-y: scroll;
		overflow-x: hidden;
		flex-flow: column;
		justify-content: flex-start;
		align-items: center;
		margin: 0 auto;
		margin-top: 34rpx;
		/* background-color: #bfa; */
	}

	.top-title {
		display: flex;
		justify-content: center;
		width: 675rpx;
		height: 120rpx;
		/* background-color: #007AFF; */
		font-size: 40rpx;
		font-weight: bold;
	}

	.wx-gzh {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		width: 675rpx;
		height: 120rpx;
		/* background-color: #007AFF; */
		border: 1rpx #fff solid;
		border-radius: 100rpx;
		box-shadow: 0px 0px 20rpx 0px rgba(0, 0, 0, 0.1);

	}

	.wx-gzh .gzh-img {
		width: 150rpx;
		height: 120rpx;
		/* margin-left: 30rpx; */
		/* background-color: #bfa; */
	}

	.wx-gzh .gzh-img image {
		width: 80rpx;
		height: 80rpx;
		margin: 20rpx auto;
		margin-left: 40rpx;
		border: #007AFF 1rpx solid;
		/* background-color: orange; */
	}

	.wx-gzh .gzh-info {
		display: flex;
		flex-flow: column;
		justify-content: center;
		width: 340rpx;
		height: 120rpx;
		/* background-color: #fff; */
	}

	.gzh-focus {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 190rpx;
		height: 120rpx;
		/* background-color: orange; */
	}

	.gzh-focus .focus-btn {
		display: flex;
		justify-content: center;
		align-items: center;
		color: #fff;
		width: 116rpx;
		height: 54rpx;
		background-color: #0EC1E5;
		border-radius: 100rpx;
	}

	.content-image {
		width: 100%;
		height: 200rpx;
		/* background-color: #007AFF; */
	}

	.content-text {
		margin-top: 20rpx;
		width: 100%;
		font-size: 27rpx;
		/* height: 500rpx; */
		/* background-color: #bfa; */
	}

	/* 文章底部阅读量 */
	.user-operation {
		display: flex;
		width: 100%;
		margin-top: 200rpx;
		margin-bottom: 200rpx;
		height: 40rpx;
		/* background-color: #4CD964; */
	}

	.user-operation view {
		margin-left: 20rpx;
		color: #808080;
	}

	.user-operation view image {
		width: 30rpx;
		height: 24rpx;
		margin-right: 5rpx;
	}

	/* 右侧跳转导航 */
	.right-nav {
		/* position: fixed; */
		left: 650rpx;
		top: 1200rpx;
		width: 80rpx;
		height: 80rpx;
		/* background-color: #007AFF; */
	}

	.right-nav image {
		width: 80rpx;
		height: 80rpx;
		position: absolute;
	}
</style>
